<section id="visitor-detail" class="pl-24 pr-24 mb-20">
	<hl-page-header title="访客单详情"></hl-page-header>
	
	<div class="mt-10">
		<div class="v-title">关联信息</div>
		<div class="mt-5">
			<span class="color-999">关联对象：</span>
			<span>{{detailData.refCstmrTypeVal}}</span>
		</div>
		<!-- 线索 -->
		<div class="v-customer border mt-10" v-if="detailData.refCstmrType == 'XS' && detailData.visitorFormRefCstmrList.length">
			<div class="v-customer-head dy-flex text-center line-height-40 color-999">
				<div class="dy-fx-2">客户名称</div>
				<div class="dy-fx-3">主题</div>
				<div class="dy-fx-2">联系人</div>
				<div class="dy-fx-3">联系电话</div>
				<div class="dy-fx-2">线索来源</div>
			</div>
			<div class="dy-flex text-center line-height-40 border-t" v-for="item in detailData.visitorFormRefCstmrList">
				<div class="dy-fx-2 border-r">{{item.customerName}}</div>
				<div class="dy-fx-3 border-r">{{item.theme}}</div>
				<div class="dy-fx-2 border-r">{{item.lperson}}</div>
				<div class="dy-fx-3 border-r">{{item.phone}}</div>
				<div class="dy-fx-2">{{item.sourceVal}}</div>			
			</div>
		</div>
		
		<!-- 客户 -->
		<div class="v-customer border mt-10" v-if="detailData.refCstmrType == 'KH' && detailData.visitorFormRefCstmrList.length">
			<div class="v-customer-head dy-flex text-center line-height-40 color-999">
				<div class="dy-fx-2">客户名称</div>
				<div class="dy-fx-3">简称</div>
				<div class="dy-fx-2">客户类型</div>
				<div class="dy-fx-3">联系人</div>
				<div class="dy-fx-2">联系电话</div>
			</div>
			<div class="dy-flex text-center line-height-40 border-t" v-for="item in detailData.visitorFormRefCstmrList">
				<div class="dy-fx-2 border-r">{{item.customerName}}</div>
				<div class="dy-fx-3 border-r">{{item.customerShortName}}</div>
				<div class="dy-fx-2 border-r">{{item.customerTypeVal}}</div>
				<div class="dy-fx-3 border-r">{{item.lperson}}</div>
				<div class="dy-fx-2">{{item.phone}}</div>			
			</div>
		</div>
	</div>
	
	<div class="mt-15">
		<div class="v-title">基础信息</div>
		<div class="dy-flex line-height-34">
			<div class="dy-fx-1 dy-flex">
				<span class="v-width color-999">访客单编号：</span>
				<span>{{detailData.no}}</span>
			</div>
			<div class="dy-fx-1 dy-flex">
				<span class="v-width color-999">咨询日期：</span>
				<span>{{detailData.consultTime | formatDate}}</span>
			</div>
		</div>
		
		<div class="dy-flex line-height-34">
			<div class="dy-fx-1 dy-flex">
				<span class="v-width color-999">访客单类型：</span>
				<span>{{detailData.typeVal}}</span>
			</div>
			<div class="dy-fx-1 dy-flex"></div>
		</div>
		
		<div class="dy-flex line-height-34">
			<div class="dy-fx-1 dy-flex">
				<span class="v-width color-999">渠道分类：</span>
				<span>{{detailData.channelCategoryCodeVal}}</span>
			</div>
			<div class="dy-fx-1 dy-flex">
				<span class="v-width color-999">渠道名称：</span>
				<span>{{detailData.channelNameCodeVal || '--'}}</span>
			</div>
		</div>
		
		<div class="dy-flex line-height-34">
			<div class="dy-fx-1 dy-flex">
				<span class="v-width color-999">中介带看人：</span>
				<span>{{detailData.intermediaryName}}</span>
			</div>
			<div class="dy-fx-1 dy-flex">
				<span class="v-width color-999">联系方式：</span>
				<span>{{detailData.intermediaryPhone}}</span>
			</div>
		</div>		
	</div>
	
	<div class="mt-15">
		<div class="v-title">客户信息</div>
		
		<div class="dy-flex line-height-34">
			<div class="dy-fx-1 dy-flex">
				<span class="v-width color-999">客户名称：</span>
				<span>{{detailData.customerName}}</span>
			</div>
			<div class="dy-fx-1 dy-flex">
				<span class="v-width color-999">客户类型：</span>
				<span>{{detailData.customerType == 'QY' ? '企业' : '客户'}}</span>
			</div>
		</div>
		
		<div class="dy-flex line-height-34">
			<div class="dy-fx-1 dy-flex">
				<span class="v-width color-999">所属行业：</span>
				<span>{{detailData.industryCodeVal}}</span>
			</div>
			<div class="dy-fx-1 dy-flex"></div>
		</div>
		
		<div class="dy-flex line-height-34">
			<div class="dy-fx-1 dy-flex">
				<span class="v-width color-999">联系人：</span>
				<span>{{detailData.customerLperson}}</span>
			</div>
			<div class="dy-fx-1 dy-flex">
				<span class="v-width color-999">联系方式：</span>
				<span>{{detailData.customerPhone}}</span>
			</div>
		</div>		
	</div>
	
	<div class="mt-15">
		<div class="v-title">意向信息</div>
		<div class="dy-flex line-height-34">
			<div class="dy-fx-1 dy-flex">
				<span class="v-width color-999">意向水平：</span>
				<span>{{detailData.intentLevelVal}}</span>
			</div>
			<div class="dy-fx-1 dy-flex"></div>
		</div>	
	</div>
	<div style="border-bottom: 1px dotted #ddd;padding: 10px 0 0;margin-bottom: 10px;"></div>
	<div class="dy-flex line-height-34">
		<span class="v-width color-999">需求时间：</span>
		<span>{{detailData.intentBeginTime | formatDate}} 至 {{detailData.intentEndTime | formatDate}}</span>
	</div>
	<div class="dy-flex line-height-34">
		<span class="v-width color-999">需求类型：</span>
		<span>{{detailData.intentContractType == 'ER' ? '整租' : '工位'}}</span>
	</div>
	<div class="dy-flex line-height-34" v-if="detailData.intentContractType == 'WR'">
		<span class="v-width color-999">需求个数：</span>
		<span>{{detailData.intentAcreageCode}}个</span>
	</div>
	<div class="dy-flex line-height-34" v-if="detailData.intentContractType == 'ER'">
		<span class="v-width color-999">需求面积：</span>
		<span>{{detailData.intentAcreageCodeVal}}m²</span>
	</div>
	<div class="dy-flex line-height-34">
		<span class="v-width color-999">需求车位：</span>
		<span>{{detailData.intentParkingCount}}个</span>
	</div>
	<div class="dy-flex line-height-34">
		<span class="v-width color-999">意向项目：</span>
		<span>{{detailData.intentProjectName}}</span>
	</div>
	
	<div v-if="detailData.projectInfo.units.length">
		<div class="color-999">意向单元：</div>
		<div class="v-customer border mt-10" >
			<div class="v-customer-head dy-flex text-center line-height-40 color-999">
				<div class="dy-fx-2">楼宇</div>
				<div class="dy-fx-3">楼层</div>
				<div class="dy-fx-2">单元</div>
			</div>
			<div class="dy-flex text-center line-height-40 border-t" v-for="item in detailData.projectInfo.units">
				<div class="dy-fx-2 border-r">{{item.buildingName}}</div>
				<div class="dy-fx-3 border-r">{{item.floorNum}}</div>
				<div class="dy-fx-2">{{item.unitName}}</div>			
			</div>
		</div>
	</div>
	
	<div v-if="detailData.projectInfo.wpsRecombination.length">
		<div class="mt-10 color-999">意向工位:</div>
		<div class="v-customer border mt-10">
			<div class="v-customer-head dy-flex text-center line-height-40 color-999">
				<div class="dy-fx-2">楼宇</div>
				<div class="dy-fx-2">楼层</div>
				<div class="dy-fx-2">单元</div>
				<div class="dy-fx-1">工位数</div>
				<div class="dy-fx-3">工位清单</div>
			</div>
			<div class="dy-flex text-center line-height-40 border-t" v-for="item in detailData.projectInfo.wpsRecombination">
				<div class="dy-fx-2 border-r">{{item.buildingName}}</div>
				<div class="dy-fx-2 border-r">{{item.floorNum}}</div>
				<div class="dy-fx-2 border-r">{{item.unitName}}</div>
				<div class="dy-fx-1 border-r">{{item.child.length}}</div>
				<div class="dy-fx-3 dy-flex">
					<div class="ml-10" v-for="(item1, index1) in item.child">
						{{item1.name}}<span v-if="index1 < item.child.length-1">,</span>
					</div>
				</div>						
			</div>
		</div>
	</div>
	
	<!-- 自定义字段 -->
	<div class="mt-15">
		<hl-custom-fileds type="VISITOR_FORM" :data="tmpData" mode="detail"></hl-custom-fileds>
	</div>
	
	<div class="border-t pt-15 mt-15">
		<hl-button type="primary" @on-click="toEditor">编辑</hl-button>
	</div>
</section>

<script src="modules/visitor/scripts/detail.js" charset="utf-8"></script>

<style type="text/css">
	.v-width {
		width: 85px;
	}
	.v-title {
		font-size:14px;
		font-family:PingFangSC-Medium,PingFang SC;
		font-weight:500;
		color:rgba(146,155,168,1);
	}
	.v-customer-head {
		background:linear-gradient(180deg,rgba(250,250,250,1) 0%,rgba(234,234,234,1) 100%);
	}	
</style>